<template>
  <div class="app">
    <!-- vue3处理keep-alive借助动态组件  includes还是include-->
    <router-view v-slot="props">
      <keep-alive includes="home">
        <component :is="props.Component"></component>  
      </keep-alive>
    </router-view>

    <!-- keep-alive的includes匹配的是组件的name。vue2这种写法在Vue3里已经不管用了 -->
    <!-- <keep-alive>
      <router-view/>
    </keep-alive> -->
    <tab-bar v-show="!route.meta.hideTabBar"></tab-bar>
    <loading/>
  </div>
</template>

<script setup>
import TabBar from "@/components/tabBar/index.vue"
import Loading from "@/components/loading/index.vue"
import { useRoute } from "vue-router"

const route = useRoute()
</script>
